@charset "UTF-8";
*{
  margin: 0;
  padding: 0;
}
body{
  font-family: "Microsoft Yahei",verdana;
}
#fullPage-nav{
  _display:none;
  li{
    border: 1px solid black;
    width: 70px;
    height: 20px;
    a{
      color: #000000;
      width: 20px;
      height: 20px;
      float: right;
      background: url("../img/dot.png")5px 5px no-repeat;
    }
    .active{
      //设置选中激活状态的样式
      background-position: 0 bottom;
    }
  }
  span{
    //隐藏自带的导航样式
    display: none;
  }
}
.fullPage-tooltip{
  color: black;
  font-family: 微软雅黑;
  line-height: 23px;
}



*{
  margin: 0;
  padding: 0;
}
.section1{
  position:relative;
  overflow: hidden;
  .bg{
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    img{
      display: block;
      width: 100%;
      height: 100%;
    }
  }
    .bg12{
      position: absolute;
      bottom: -292px;
      width: 100%;
      height: 392px;
      background: url("../img/bg12.png") 50% 0 no-repeat;
      opacity: 0;
      transition: all 1.7s;  //时间长动画慢
    }
  .bg13{
    position: absolute;
    bottom: -377px;
    width: 100%;
    height: 377px;
    background: url("../img/bg13.png") 50% 0 no-repeat;
    transition: all 1s;
  }
  .mail{
    position: absolute;
    left: 50%;
    top: -25px;  //滑动到当前页时，保证有一个动画的效果，这里给负值
    width: 375px;
    height: 26px;
    margin-left: -187px;
    background-image: url("../img/logo.png");
    transition: all 1s;
    float: left;
    height: 26px;
    text-indent: -9999px;//隐藏文字

    .mail-163{
      float: left;
      width: 107px;
    }
    .mail-126{
      float: left;
      width: 108px;
      margin-left: 23px;
    }
    .mail-yeah{
      float: right;
      width:115px;
    }
  }
  .hgroup{
    width: 554px;
    height: 176px;
    position: absolute;
    left: 420px;
    top: 180px;
    text-indent: -9999px;  //隐藏字
    background: url("../img/slogan.png") no-repeat;
    opacity: 0;
    transition: all 1s;
  }
}
.section2{
  position:relative;
  overflow: hidden;
  .bg2{
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    img{
      display: block;
      width: 100%;
      height: 100%;
    }
  }
  .eyes{
    position: absolute;
    left: 429px;
    top: 70px;
    font-size: 24px;
    color: #727f8c;
  }
 .t2{
   width: 512px;
   height: 45px;
   position: absolute;
   left: 50%;
   margin-left: -255px;
   top: 130px;
   background: url("../img/t2.png") no-repeat;
   text-indent: -9999px;
   //opacity: 0;
   transition: all 1s;
 }
  .t2_font{
    width: 510px;
    position: absolute;
    left: 50%;
    margin-left: -255px;
    top: 354px;
    line-height: 1.9;
    color:#748a9e;
    font-size: 16px;
    opacity: 0;
    transition: all 1s;
  }
  .bg23{
    width: 819px;
    height: 325px;
    position: absolute;
    left: 310px;
    bottom: -170px;
    opacity: 0;
    background: url("../img/bg23.png")no-repeat;
    transition:all 1s ;
  }
  .bg21{
    width: 233px;
    height: 250px;
    position: absolute;
    top: 430px;
    left: -210px;
    background: url("../img/bg21.png") no-repeat;
    opacity:0 ;
    transition: all 1.2s;
  }
  .bg22{
    width: 211px;
    height: 299px;
    position: absolute;
    top:382px;
    right: -112px;
    background: url("../img/bg22.png")no-repeat;
    transition: all 1.2s;
  }
}

.section3{
  position:relative;
  overflow: hidden;
  .bg3{
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    img{
      display: block;
      width: 100%;
      height: 100%;
    }
  }
  .eyes_3{
    position: absolute;
    top: 144px;
    left:400px;
    color:#c9c87d;
    font-size: 24px;
  }
  .t3{
    width: 513px;
    height: 45px;
    position: absolute;
    left: 400px;
    top: 190px;
    text-indent: -9999px;
    background: url("../img/t3.png")no-repeat;
    transition: all 1s;
  }
  .t3_font{
    width: 430px;
    position: absolute;
    top: 378px;
    left: 60px;
    font-size: 16px;
    color: #fffde1;
    line-height: 1.9;
    opacity: 0;
    transition: all 1s;
  }
  .bg31{
    width: 892px;
    height: 472px;
    position: absolute;
    left: 370px;
    top: 304px;
    background: url("../img/bg31.png")no-repeat;
    opacity: 0;
    transition: all 1s;
  }
  .bg32{
    width: 322px;
    height: 143px;
    position: absolute;
    left: 910px;
    bottom:24px;
    z-index: -10;
    background: url("../img/bg32.png")no-repeat;
    opacity: 0;
    transition: all 1s;
  }
  .bg33{
    width: 441px;
    height: 380px;
    position: absolute;
    left: 810px;
    top: 470px;
    z-index: 30;
    opacity: 0;
    background:url("../img/bg33.png") no-repeat;
    transition: all 1s;
  }
}

.section4{
  position: relative;
  overflow: hidden;
  .bg4{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    img{
      display: block;
      width: 100%;
      height: 100%;
    }
  }
  .pifu{
    position: absolute;
    left: 419px;
    top: 138px;
    color: #a0b4cb;
    font-size: 24px;
  }
  .beautiful{
    width: 512px;
    height: 45px;
    position: absolute;
    left: 419px;
    top: 189px;
    text-indent: -9999px;
    background: url("../img/t4.png")no-repeat;
    transition: all 1s;
  }
  .t4{
    width: 510px;
    color: #798fa6;
    position: absolute;
    left: 417px;
    top: 310px;
    font-size: 16px;
    line-height: 1.9;
    opacity: 0;
    transition: all 1s;
  }
  .bg41{
    width: 1228px;
    height: 372px;
    position: absolute;
    left: 50px;
    top: 367px;
    z-index: 1;
    background: url("../img/bg41.png")no-repeat;
    transition: all 1s;
  }
  .bg42{
    width: 1156px;
    height: 449px;
    position: absolute;
    left: 107px;
    top: 400px;
    z-index: 2;
    background: url("../img/bg42.png")no-repeat;
    opacity: 0;
    transition: all 1s;
  }
  .bg43{
    width: 1019px;
    height: 248px;
    position: absolute;
    left: 137px;
    top: 427px;
    z-index: 3;
    background: url("../img/bg43.png")no-repeat;
    transition: all 1s;
  }
}

.section5{
  position: relative;
  overflow: hidden;
  .bg4{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    img{
      display: block;
      width: 100%;
      height: 100%;
    }
  }
  .gongneng{
    position: absolute;
    left: 354px;
    top: 144px;
    font-size: 24px;
    line-height: normal;
    color: #999fac;
  }
  .linghuo{
    width: 511px;
    height: 44px;
    text-indent: -9999px;
    position: absolute;
    left: 355px;
    top: 193px;
    background: url("../img/t5.png")no-repeat;
    transition: all 1s;
  }
}

/*active指定写法，在jQuery.full*/
.active{
  h3{
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
    transition-delay: 0.7s;
  }
  .bg12{
    bottom: 90px;
    opacity: 1;
    transition-delay: 0.7s;
  }
  .bg13{
    bottom: 0;
    opacity: 1;
    transition-delay: 0.7s;
  }
  .hgroup{
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
    transition-delay: 0.7s;
  }
  .mail{
    top: 65px;  //选中状态mail的位置
    transition-delay: 0.7s;
  }
  .hgroup{
    opacity: 1;
    transform: scale(1,1);
    transition-delay: 0.7s;
  }
  .bg23{ //第二屏中间的截图
    bottom: -70px;
    opacity: 1;
    transform: scale(1,1);
    transition-delay: 0.7s;
  }
  .bg21{//截图左侧的图片
    left: 110px;
    opacity: 1;
    transform: scale(1,1);
    transition-delay: 0.8s;
  }
  .bg22{//截图you侧的图片
    right: 112px;
    opacity: 1;
    transform: scale(1,1);
    transition-delay: 0.8s;
  }
  .t2_font{  //第二屏的长段文字
    top: 254px;
    opacity: 1;
    transform: sale(1,1);
    transition-delay: 0.7s;
  }
  .bg31{
    opacity: 1;
    transform: scale(1,1);
    transition-delay: 0.7s;
  }

  .bg32{
    bottom:-234px;
    opacity: 1;
    transform: sacle(1,1);
    transition-delay: 0.7s;
  }
  .bg33{
   left: 646px;
   opacity: 1;
   transform: scale(1,1);
   transition-delay: 0.7s;
 }
 .t3_font{
  left: 160px;
  opacity: 1;
  transform: scale(1,1);
  transition-delay: 0.7s;
 }
  .t4{
    opacity: 1;
    top: 264px;
    transform: scale(1,1);
    transition-delay: 0.7s;
  }
  .bg42{
    opacity: 1;
    top: 300px;
    transform: scale(1,1);
    transition-delay: 0.7s;
  }
}